<table class="table table-bordered essence-table">
	<thead>
	<tr class="bg-info">
		<td *ngIf="_config.columns.batch.enabled" class="text-center">
			<input type="checkbox" [checked]="_batchAllCheckStatus" (change)="_checkboxAllChangeEvent($event)">
		</td>
		<th *ngIf="_config.columns.index.enabled" class="text-nowrap text-center">序号</th>
		<ng-container *ngFor="let column of _config.columns.items;let columnIndex=index;">
			<th *ngIf="column.visible" [ngClass]="_getColumnStyle(column)" (click)="_sort(column)" [attr.width]="column.width" class="text-nowrap">
				{{column.label}} <i class="fa hidden-print" *ngIf="column.order" [ngClass]="{'fa-sort text-muted': column.order === 'sort' || column.order === true, 'fa-sort-asc': column.order === 'asc', 'fa-sort-desc': column.order === 'desc'}"></i>
			</th>
		</ng-container>
	</tr>
	</thead>
	<tbody *ngIf="_tableData">
	<ng-container *ngFor="let data of _tableData.pageInfo.items;let dataIndex=index;">
		<tr>
			<td *ngIf="_config.columns.batch.enabled" class="text-center">
				<input type="checkbox"
				       [checked]="data.selected"
				       (change)="_checkboxChangeEvent($event,data)">
			</td>
			<td *ngIf="_config.columns.index.enabled" class="text-center">{{dataIndex+_tableData.pageInfo.beginRecord}}</td>
			<ng-container *ngFor="let column of _config.columns.items;let columnIndex=index;">
				<td *ngIf="column.visible" [ngClass]="column.cls">
					<span *ngIf="_isFunction(column.render) && column.render(data)">{{column.render(data)}}</span>
					<span *ngIf="!_isFunction(column.render) || !column.render(data)">{{data[column.colName]}}</span>
					<div *ngIf="!column.colName">
						<ng-container *ngFor="let button of column.render;let buttonIndex=index;">
							<button *ngIf="!_isFunction(button.exist) || button.exist(data)" type="button" class="btn" [ngClass]="button.cls" (click)="button.event(data)">{{button.text}}</button>
						</ng-container>
					</div>
				</td>
			</ng-container>
		</tr>
	</ng-container>
	</tbody>
	<tfoot class="hidden-print">
		<tr>
			<td *ngIf="_config.columns.batch.enabled" class="text-center">
			</td>
			<td *ngIf="_config.columns.index.enabled"></td>
			<ng-container *ngFor="let column of _config.columns.items;let columnIndex=index;">
				<td *ngIf="column.visible">
					<div *ngIf="column.filterProp.enabled">
						<input type="text" class="form-control" (keyup)="_filter($event, column)" *ngIf="column.filterProp.type === 'string'" [placeholder]="column.label">
						<select class="form-control" (change)="_filter($event, column)" *ngIf="column.filterProp.type === 'select'">
							<option value="">全部</option>
							<option *ngFor="let s of column.filterProp.data" [value]="s.value">{{s.text}}</option>
						</select>
						<input type="date" class="form-control" (change)="_filter($event, column)" *ngIf="column.filterProp.type === 'date'">
					</div>
				</td>
			</ng-container>
		</tr>
	</tfoot>
</table>
<div class="row" *ngIf="_tableData">
	<div class="col-sm-6">
		显示 {{_tableData.pageInfo.beginRecord}} 到 {{_tableData.pageInfo.endRecord}} 条，共 {{_tableData.pageInfo.totalRecords}} 条数据
	</div>
	<div class="col-sm-6 hidden-print">
		<div class="btn-toolbar pull-right" role="toolbar" *ngIf="_tableData.pageInfo.totalRecords > 0">
			<div class="btn-group">
				<button type="button" class="btn btn-sm btn-default" (click)="_prePage()" [disabled]="_tableData.pageInfo.currentPageNum == 1"><i class="fa fa-chevron-left"></i></button>
			</div>
			<div class="btn-group">
				<ng-container *ngFor="let b of _numberArray(_tableData.pageInfo.totalPages)">
					<button *ngIf="_generateForButton(b, _tableData.pageInfo.currentPageNum, _numberArray(_tableData.pageInfo.totalPages).length)" class="btn btn-sm btn-default" [disabled]="_generateForText(b, _tableData.pageInfo.currentPageNum, _numberArray(_tableData.pageInfo.totalPages).length)==='...'" [ngClass]="{active: b == _tableData.pageInfo.currentPageNum}" (click)="_toPage(_generateForText(b, _tableData.pageInfo.currentPageNum, _numberArray(_tableData.pageInfo.totalPages).length)==='...'?-1:b)" >
						{{_generateForText(b, _tableData.pageInfo.currentPageNum, _numberArray(_tableData.pageInfo.totalPages).length)}}
					</button>
				</ng-container>
			</div>
			<div class="btn-group">
				<button type="button" class="btn btn-sm btn-default" (click)="_nextPage()" [disabled]="_tableData.pageInfo.currentPageNum == _tableData.pageInfo.totalPages"><i class="fa fa-chevron-right"></i></button>
			</div>
		</div>
	</div>
</div>
